import 'package:flutter/material.dart';

import 'package:get/get.dart';
import 'package:flutter_widgets_pc/resources/kq_theme_colors.dart';
import 'package:flutter_widgets_pc/utils/collection_util.dart';
import 'package:flutter_widgets_pc/widgets/divider/kq_divider.dart';
import 'package:flutter_widgets_pc/widgets/dragView/kq_drag_list_view.dart';
import 'package:flutter_widgets_pc/widgets/image/kq_image.dart';
import 'package:flutter_widgets_pc/widgets/titleBar/kq_title_bar.dart';

import '../../resources/Images.dart';

/// 拖拽演示demo - 列表
class DragListViewDemoPage extends StatefulWidget {
  const DragListViewDemoPage({Key? key}) : super(key: key);

  @override
  DragListViewDemoPageState createState() => DragListViewDemoPageState();
}

class DragListViewDemoPageState extends State<DragListViewDemoPage> {
  List<Widget> list = [];

  @override
  void initState() {
    list = buildWidgets2();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: KqHeadBar(
          headTitle: 'List拖拽演示',
          back: () {
            Get.back();
          },
        ),
        body: KqDragListView(
          dragIconMarginEnd: (index) => 15,
          dragIconMarginTop: 20,
          onReorder: (int oldIndex, int newIndex) {
            setState(() {
              //交换数据位置
              CollectionUtil.swap(list, oldIndex, newIndex);
            });
          },
          children: list,
        ));
  }

  buildWidgets2() {
    return [
      buildWidget2('计划单报表', "111"),
      buildWidget2('任务单报表', "222"),
      buildWidget2('生产报表', "333"),
      buildWidget2('利用率报表', "444"),
      buildWidget2('OEE报表', "555"),
    ];
  }

  /// 这个[key]可以用后端返回唯一id，便于排序之后拼接排序后的结果
  Widget buildWidget2(String title, String key) {
    return Column(
      key: Key(key),
      children: [
        Container(
          color: KqThemeColors.bgWhite,
          height: 100,
          padding: EdgeInsets.symmetric(horizontal: 10),
          child: Row(
            mainAxisSize: MainAxisSize.max,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              KqImage(imageType: ImageType.assets, url: Images.homeIcTouxiang),
              SizedBox(
                width: 10,
                height: 1,
              ),
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style:
                        TextStyle(color: KqThemeColors.text666, fontSize: 14),
                  ),
                  SizedBox(
                    width: 1,
                    height: 10,
                  ),
                  Text(
                    '昨日产出23141个',
                    style:
                        TextStyle(color: KqThemeColors.text999, fontSize: 12),
                  )
                ],
              )
            ],
          ),
        ),
        const KqDivider()
      ],
    );
  }
}
